<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>欢迎访问微店商城</title>
  <link rel="stylesheet" href="./bootstrap-3.4.1-dist/css/bootstrap.min.css">
  <link rel="stylesheet" href="./css/index.css">
  <script src="./bootstrap-3.4.1-dist/js/jquery-3.6.0.min.js"></script>
  <script src="./bootstrap-3.4.1-dist/js/bootstrap.min.js"></script>
</head>
<body>
  <div id="top" class="container_fluid">
    <div id="top_center" class="container">
      <ul class="list-inline">
        <li><a href="#top01" class="top_href">用户注册</a></li>
        <li><a href="#top02" class="top_href">用户登录</a></li>
        <li><a href="#top03" class="top_href">系统管理</a></li>
      </ul>
    </div>
  </div>
  <div id="band" class="container-fluid">
    <div class="row">
      <div class="col-md-3 col-sm-3" id="band_icon"></div>
      <div class="col-md-4 col-sm-4 visible-sm visible-md visible-lg">
        <div class="input-group" id="top_search">
          <input type="text" class="form-control" placeholder="搜索信息">
          <span class="input-group-btn">
            <button class="btn btn-default" type="button">点击搜索</button>
          </span>
        </div><!-- /input-group -->
      </div>
      <div class="col-md-4 col-sm-4 visible-md visible-sm visible-lg" id="cart">
         <span>我的购物车 <span class="badge">4</span></span>
      </div>
    </div>
  </div>
  
  <nav class="navbar navbar-default">
    <div class="container-fluid">
      <!-- Brand and toggle get grouped for better mobile display -->
      <div class="navbar-header">
        <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1" aria-expanded="false">
          <span class="sr-only">Toggle navigation</span>
          <span class="icon-bar"></span>
          <span class="icon-bar"></span>
          <span class="icon-bar"></span>
        </button>
        <a class="navbar-brand visible-md visible-lg" href="#">分类</a>
      </div>

      <div class="visible-xs" id="m_search">
        <div class="input-group">
          <input type="text" class="form-control" placeholder="搜索信息">
          <span class="input-group-btn">
            <button class="btn btn-default" type="button">搜索</button>
          </span>
        </div><!-- /input-group -->
        <div id="m_cart">购物车<span class="badge">4</span></div>
        <div class="clearfix"></div>
      </div>
  
      <!-- Collect the nav links, forms, and other content for toggling -->
      <div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
        <ul class="nav navbar-nav">
          <li class="active"><a href="#">网站首页 <span class="sr-only">(current)</span></a></li>
          <li><a href="#n01">手机精选</a></li>
          <li><a href="#n02">主要书籍</a></li>
          <li><a href="#n03">电脑周边</a></li>
          <li><a href="#n04">教学资料</a></li>
          <li><a href="#n05">教学课件</a></li>
          <li><a href="#n05">二手物品</a></li>
        </ul>
      </div><!-- /.navbar-collapse -->
    </div><!-- /.container-fluid -->
  </nav>
  <div class="container-fluid product" id="zxzk">
    <h3><span>最新折扣</span></h3>
    <div class="row">
      <div class="col-md-3 col-sm-6 zxzk_c">
        <img src="d01.jpg" width="315" alt="">
        <div class="zxzk_intro">
          <p>
            <span class="glyphicon glyphicon-calendar"></span>
            <span>2023/4/19</span>
            <del>￥1998</del>
            <span>￥199</span>
          </p>
          <h4>铁三角耳机M100精装版</h4>
        </div>
      </div>
      <div class="col-md-3 col-sm-6">B</div>
      <div class="col-md-3 col-sm-6">C</div>
      <div class="col-md-3 col-sm-6">D</div>
    </div>
  </div>

</body>
</html>